<div class="pod-template-block">
  <div
    ng-repeat="template in templates"
    class="pod-template">
    <div class="pod-container-name">Storage claim: {{template.metadata.name}}</div>

    <div class="pod-template-image icon-row">
      <div class="icon-wrap">
        <span class="fa fa-lock" aria-hidden="true"></span>
      </div>
      <div class="pod-template-detail word-break">
        <span class="pod-template-key">Access Modes:</span>
        <span ng-repeat="mode in template.spec.accessModes">
          {{mode | sentenceCase }}<span ng-if="!$last">, </span>
        </span>
      </div>
    </div>

    <div class="pod-template-image icon-row">
      <div class="icon-wrap">
        <span class="fa fa-database" aria-hidden="true"></span>
      </div>
      <div class="pod-template-detail word-break">
        <span class="pod-template-key">Capacity:</span>
        <span>
          {{template.spec.resources.requests.storage}}
        </span>
      </div>
    </div>

    <div
      class="pod-template-image icon-row"
      ng-if="template.spec.selector.matchLabels">
      <div class="icon-wrap">
        <span class="fa fa-tag" aria-hidden="true"></span>
      </div>
      <div class="pod-template-detail word-break">
        <span class="pod-template-key">Selector:</span>
        <selector selector="template.spec.selector"></selector>
      </div>
    </div>

  </div>
</div>
